<!DOCTYPE html>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%@ taglib prefix="form" uri="http://www.springframework.org/tags/form"%>
<%@ page session="false" contentType="text/html; charset=UTF-8" pageEncoding="utf8"%>
<html>
<head>
<title>The list of existing activities</title>
<link rel="stylesheet" type="text/css" href="<c:url value="/resources/css/smoothness/jquery-ui-1.8.17.custom.css" />">
<link rel="stylesheet" type="text/css" href="<c:url value="/resources/css/style.css" />">
</head>
<body>
	<h1>Activities list</h1>
	<p>${message}</p>

	<div id="mainContainer">
		<form:form id="searchactivity" class="searchfield" name="searchactivity" method="GET"
			commandName="activity" action="/ingredients/activity/search/">
			<label for="term">Search for an activity:</label>
			<!--  ui-widget should be defined for element access over JQuery UI -->
			<input id="term" name="term" class="ui-widget" />
			<input type="submit" value="search" />
		</form:form>

		<div id="datatableContainer">
			<table id="datatable" width="100%">
				<thead>
					<tr>
						<td>Activity name</td>
						<td>Description</td>
						<td>Type</td>
						<td>Id</td>
						<td>Action</td>
						<td>Sub-activities</td>
						<td>Action</td>
					</tr>
				</thead>
				<tbody>
					<c:forEach items="${activities}" var="current_activity">
						<tr>
							<td>${current_activity.name}</td>
							<td>${current_activity.description}</td>
							<td>${current_activity.type}</td>
							<td>${current_activity.id}</td>
							<td><a
								href="/ingredients/activity/delete/${current_activity.id}"
								class="deleteLink">Delete</a></td>
							<c:set var="subactivities"
								value="${activityDAO.getActivitiesByParentId(current_activity.id)}" />
							<td>
								<table>
									<c:forEach items="${subactivities}" var="current_subactivity">
										<tr>
											<td>${current_subactivity.name}</td>
										</tr>
									</c:forEach>
								</table>
							</td>
							<td>
								<table>
									<c:forEach items="${subactivities}" var="current_subactivity">
										<tr>
											<td><a
												href="/ingredients/activity/delete/${current_subactivity.id}"
												class="deleteLink">Delete</a></td>
										</tr>
									</c:forEach>
								</table>
							</td>
						</tr>
					</c:forEach>
				</tbody>
			</table>
		</div>

		<fieldset>
			<legend>Add new activity</legend>
			<form:form modelAttribute="newActivity" method="POST"
				action='/ingredients/activity/add'>
				<label for="name">Name:</label>
				<form:input id="activity_name" path="name" value="${name}" />
				<label for="description">Description:</label>
				<form:input id="description" path="description"
					value="${description}" />
				<br />
				<label for="type">Type:</label>
				<form:input id="type" path="type" value="${type}" />
				<label for="parentId">Parent Id:</label>
				<form:input id="parentId" path="parentId" value="${parentId}" />
				<input id="submitNewActivity" type="submit" value="Add" />
			</form:form>
		</fieldset>
	</div>

	<center>
	<a href="/ingredients"	class="deleteLink">Ingredients list</a>
	</center>


	<script type="text/javascript"
		src="<c:url value="/resources/js/lib/jquery-1.7.1.min.js" />"></script>
	<script type="text/javascript"
		src="<c:url value="/resources/js/lib/jquery-ui-1.8.17.custom.min.js" />"></script>
	<script type="text/javascript"
		src="<c:url value="/resources/js/lib/jquery-datatables-1.9.4.js" />"></script>
	<script type="text/javascript"
		src="<c:url value="/resources/js/lib/log4javascript.js" />"></script>
	<script type="text/javascript"
		src="<c:url value="/resources/js/script.js" />"></script>

</body>
</html>